<template>
	<view class="wrap">
		<view class="activity">
			<text class="activity_type">{{activityTypeStr}}</text>
		</view>
		
		<view class="">
			<view class="content">
				<text class="title">状态</text>
				<text>{{activityStatusStr}}</text>
			</view>
			<u-line color="#e2e2e2"></u-line>
		</view>
		
		<view class="">
			<view class="content">
				<text class="title">订单编号</text>
				<text>{{orderObj.orderNo}}</text>
			</view>
			<u-line color="#e2e2e2"></u-line>
		</view>
		
		<view class="">
			<view class="content">
				<text class="title">活动名称</text>
				<text>{{orderObj.activityName}}</text>
			</view>
			<u-line color="#e2e2e2"></u-line>
		</view>
		
		<view class="" v-if="orderObj.activityType !=1">
			<view class="content">
				<text class="title">奖品</text>
				<text>{{orderObj.prize}}</text>
			</view>
			<u-line color="#e2e2e2"></u-line>
		</view>
		
		<view class="bottomView">
			<view v-if="orderObj.activityType == 1">
				<text class="title">活动定金</text>
				<text class="amount">¥{{orderObj.amount}}</text>
			</view>	
			<view class="button" @click="goDetail">
				详情
			</view>
		</view>
		
	</view>
</template>

<script>
	export default {
		name: 'activity-order-list',
		data() {
			return {
				activityTypeStr: '',
				activityStatusStr: '',
				linkUrl: ''
			}
		},
		props: {
			orderObj : {
				type: Object,
				default() {
					return {}
				}
			}
		},
		methods: {
			goDetail() {
				uni.navigateTo({						
					url: this.linkUrl +'?orderNo=' + this.orderObj.orderNo
				})
				
			}
		},
		
	  mounted() {
	  	let activityType = this.orderObj.activityType;
			switch(activityType) {
				case 1: 
				  this.activityTypeStr = '秒杀活动';
					this.linkUrl = '../../pages/activity/orderDetail-secondKill';
				break
				case 2:
				  this.activityTypeStr = '集客活动'
				break
				case 3:
				  this.activityTypeStr = '同行活动'
					this.linkUrl = '../../pages/activity/orderDetail-peer';
				break
				case 4:
				  this.activityTypeStr = '抽奖活动'
					this.linkUrl = '../../pages/activity/orderDetail-sweepstakes';
				break
				default:
				   this.activityTypeStr = '未知'
					 break
			}
			
			let activityStatus = this.orderObj.activityStatus;
			switch(activityStatus) {
				case 1:
				this.activityStatusStr = '未使用'
				break
				case 2:
				this.activityStatusStr = '已使用'
				break
				case 3:
				this.activityStatusStr = '已过期'
				break
				case 4:
				this.activityStatusStr = '已取消'
				break
				case 5:
				this.activityStatusStr = '已退款'
				break
				default:
				   this.activityStatusStr = '未知'
					 break
			}
			
	  }
	}
</script>

<style lang="scss" scoped>
	.wrap {
		background-color: #fff;
		border-radius: 18upx;
		margin: 0 20upx 20rpx;
	}
	.activity {
		padding: 20upx 26upx;
		&_type {
			background-color: #FF9037;
			padding: 10upx;
			border-radius: 10upx;
			color: #fff;
			font-size: 24upx;
		}
	}
	
	
	.content {
		padding: 20upx 26upx;
		display: flex;
		justify-content: space-between;
	}
	
	
	.title {
		font-size: 28upx;
		font-family: PingFang SC, PingFang SC-Medium;
		text-align: left;
		color: #666666;
	}
	.amount {
		font-size: 28upx;
		font-family: PingFang SC, PingFang SC-Medium;
		font-weight: 500;
		text-align: left;
		color: #EC4863;
		margin-left: 10upx;
	}
	.bottomView {
	    display: flex;
		height: 106upx;
		// justify-content: space-between;
		align-items: center;
		padding: 0upx 20upx;
		position: relative;
		.button {
			width: 180rpx;
			height: 66rpx;
			line-height: 66rpx;
			text-align: center;
			background-color: #12B9A3;
			color: #fff;
			font-size: 32upx;
			border-radius: 50upx;
			position: absolute;
			right: 20upx;
			
		}
	}
	
</style>
